- jsFileArr.push('/js/index.min.js')
- cssFileArr.push('/css/index.css')

include header

#contentContainer
  #rightContainer
    #messageBoard
      .content
        ul 
          - var msgData = [{user : '匿名用户', createTime : '5分钟', content : 'Chrome调试工具介绍说得很不错,详细介绍了WEB开发中的一些技巧，很实用。'}, {user : '匿名用户', createTime : '5分钟', content : 'Chrome调试工具介绍说得很不错,详细介绍了WEB开发中的一些技巧，很实用。'}, {user : '匿名用户', createTime : '5分钟', content : 'Chrome调试工具介绍说得很不错,详细介绍了WEB开发中的一些技巧，很实用。'}, {user : '匿名用户', createTime : '5分钟', content : 'Chrome调试工具介绍说得很不错,详细介绍了WEB开发中的一些技巧，很实用。'}];
          - for(var i = 0, len = msgData.length; i < len; i++){
          -   var msg = msgData[i];
          -   var msgHTML = msg.user + ':' + msg.content + '(' + msg.createTime + ')'
              li.userMsg 
                .userAvatar
                  img(src='/css/images/default_avatar.png')
                a.nick(href='#') #{msg.user}
                #{':' + msg.content}
                span.createTime #{'(' + msg.createTime + ')'}
          - }
    #technologyGuide
      .content
        p 
          a(href='http://www.lesscss.net/', target='_blank', base-tip='LESS 将 CSS 赋予了动态语言的特性，如 变量， 继承， 运算， 函数. LESS 既可以在 客户端 上运行 (支持IE 6+, Webkit, Firefox)，也可以借助Node.js或者Rhino在服务端运行。') less
          a(href='http://www.coffeescript.org/', target='_blank', base-tip='coffeescript 是一门很简单很小的语言，它能编译成javascript，它使用了更简单的语法，去除了括号等用法，和ruby,python类似，你可以认为它就是javascript，只是提供了更简单的写法。') coffeescript
          a(href='http://nodejs.org/', target='_blank', base-tip='Node是一个Javascript运行环境(runtime)，可以认为它是一个服务器端 JavaScript 解释器。实际上它是对GoogleV8引擎（应用于Google Chrome浏览器）进行了封装。V8引 擎执行Javascript的速度非常快，性能非常好。Node对一些特殊用例进行了优化，提供了替代的API，使得V8在非浏览器环境下运行得更好。') node.js
          a(href='http://expressjs.com/', target='_blank', base-tip='用于node.js的WEB开发框架') express
          a(href='http://jade-lang.com/', target='_blank', base-tip='用于node.js的WEB模板引擎') jade
          a(href='https://github.com/mishoo/UglifyJS', target='_blank', base-tip='Uglify JS 是一个服务端node.js的压缩程序，运行在node.js下') UglifyJS
    #recommendArticle
      .content
        h2 jQuery性能优化指南
        p 现在jquery应用的越来越多, 有些同学在享受爽快淋漓coding时就将性能问题忽略了,  比如我.  jquery虽在诸多的js类库中性能表现还算优秀, 但毕竟不是在用原生的javascript开发, 性能问题还是需要引起重视的. 在twitter上发现了<jQuery Performance Rules>这篇文章, 简单的摘译了一下:
        ul
          li 1.总是从ID选择器开始继承
          li 2.在class前使用tag
          li 3.将jquery对象缓存起来
          li 4.掌握强大的链式操作
        a(href='http://www.blueidea.com/tech/web/2009/6737.asp', target='_blank') 查看全文
    #plugInList
      .content
        a.plugIn(href='http://fancybox.net/', target='_blank', desc='基于jQuery的弹出框插件，支持各种的弹出动态效果，类似的插件还有ColorBox, ThickBox, LightBox等。') FancyBox
        a.plugIn(href='http://nivo.dev7studios.com/', target='_blank', desc='一款基于jQuery的幻灯片插件，提供好几种特别的效果。') nivo-slider
        a.plugIn(href='http://alexgorbatchev.com/SyntaxHighlighter/', target='_blank', desc='语法着色插件') SyntaxHighlighter
  #leftContainer
    #welcomeMsg
      .content
        p 在工作的前两年以来都是做嵌入式，虽然时间也不算太长，不过总觉得不怎么爽，一直都是对着一堆不知所谓的代码在苦恼，实力够不上。
          写这一段是为了纪念我一去不再的嵌入式开发生活。
        p 接触Web前端开发是一个偶然的事。在上一家公司，本来也是做嵌入式的，突然老板说想找人弄一些简单的页面。
          当时想着也是无聊，就自告奋勇的接手了。一开始也和其它人一样，认为网页开发只是低级的东西，很容易上手，没想到弄着弄着，还真不一般。也就在这时候，了解到了jQuery，随着深入的了解，越来越喜欢Web前端开发了，也正式开始了我的Web前端之路。
        p 做Web前端也有一段日子了，总感觉还有一堆的东西都没学好，开始发现原来还真是易学难精。废话多说了，开始转入正题。
          自己着手开发这个网站，只是为了练练手，保存一些自己喜欢的文章，也记录一些自己的的心得，当然也希望和大家分享、交流。
    #articleList
      .content
        - var articles = pageData.articles;
        - for(var i = 0, len = articles.length; i < len; i ++){
        -   var article = articles[i], createTime = new Date(parseInt(article.createTime));
            .article(lc-index='#{i}')
              .createTime
                span.month= createTime.getMonth() + '月'
                br
                span.day= createTime.getDay()
              h1.title= article.title
              p!= article.summary 
              .controlBtn
                a.readMore(href='/article/#{i}') 查看全文
                a.like(href='javascript:;') 推荐

        - }



